Does anyone know how to style a single-select dropdown, which is based on a taxonomy vocabulary?

As it is now, the styling is a dash added in front of the child terms, like this:

Parent
-Child
--Grandchild
-Child
-Child
Parent
-Child

Ideally I would like to style the parent term bold, to really make it stand out and clarify where a new category begins.

Alternatively, adding a space in front of the dash would also be an improvement, or substituting it with another character (for example »), if the first option isn't possible.

Thank you.

Comments

exobuzz’s picture

This template.php code works for me. Not perfect as I only change the values that start with a "-". I guess i need to override some select rendering function to insert some classes. or use some javascript to post process the html.

// override some exposed filter form data
function MYTHEME_preprocess_views_exposed_form(&$vars, $hook) {
  // print $vars['form']['#id'];
  switch($vars['form']['#id']) {
    case 'YOURFORMID':
      foreach ($vars['form']['YOUR_FILTER_TID']['#options'] as $option) {
        $key = key($option->option);
        // replace "-" with "  -" for child items
        $value = &$option->option[$key];
        $value = preg_replace('/^-/','-----     ',$value);
      }
      unset($vars['form']['YOUR_FILTER_TID']['#printed']);
      $vars['widgets']['filter-'YOUR_FILTER_TID']->widget = drupal_render($vars['form']['term_node_tid_depth']);
      break;
  }

}
ressa’s picture

Status: Active » Fixed

Hi exobuzz,

Great script, it got me started and is much appreciated! I combined it with another function and have posted my end result in the taxonomy group, where I probably should have posted this question in the first place: http://groups.drupal.org/node/23883

Thanks.

Status: Fixed » Closed (fixed)

Automatically closed -- issue fixed for 2 weeks with no activity.